<template>
	<view>
		
		<uni-nav-bar color="#ffffff" background-color="#bb2c08" :status-bar="true"
		 left-icon="contact"  title="我的音乐" @clickLeft="show('left')" :statusBar="true"
		 :fixed="true"/>
		 
		 <uni-drawer :visible="showLeft" mode="left" @close="closeDrawer('left')">
			 <my-info :userinfo="userinfo"></my-info>
		 </uni-drawer>
		 
		<info-list :item="item"></info-list>
		 
		 <!--加载动画-->
		 <jiazai v-if="isshow"></jiazai>
		 
		 <block v-if="!isshow">
			 <me-gedan :createList="createList" :collectList="collectList" :navtoUrl="navtoUrl" ></me-gedan>
		 </block>
	</view>
</template>

<script>
	import uniNavBar from '../../components/home/uni-nav-bar/uni-nav-bar.vue';
	import uniDrawer from '../../components/home/uni-drawer/uni-drawer.vue';
	import infoList from '../../components/home/info-list/info-list.vue';
	import jiazai from '../../components/home/jiazai/jiazai.vue';
	import meGedan from '../../components/home/me-gedan/me-gedan.vue';
	import myInfo from '../../components/home/my-info/my-info.vue'
	export default {
		components:{
			uniNavBar,
			uniDrawer,
			infoList,
			jiazai,
			meGedan,
			myInfo
		},
		data() {
			return {
				showLeft: false,
				userinfo:{
					id:0,
					name:'',
					pic:'',
					qianming:''
				},
				navtoUrl:"../playlist/playlist",
				isshow:true,
				createList:[],
				collectList:[]
			}
		},
		onLoad() {
			const userinfo=uni.getStorageSync("userinfo")||{};
			if(JSON.stringify(userinfo)=='{}'){			
			  uni.redirectTo({
				  url: '../login/login',
			  });
			}
			else{
				this.userinfo={
					id:userinfo.userId,
					name:userinfo.nickname,
					pic:userinfo.avatarUrl+'?param=50y50',
					qianming:userinfo.signature
				}
				this.getplaylist();
				this.UserLike();
			}
		},
		onHide() {
			this.hide();
		},
		methods: {
			show(e) {
				if (e === 'left') {
					this.showLeft = true
				} else {
					this.showRight = true
				}
			},
			hide() {
				this.showLeft = false
				this.showRight = false
			},
			closeDrawer(e) {
				if (e === 'left') {
					this.showLeft = false
				} else {
					this.showRight = false
				}
			},
			//发送请求
			async getplaylist(){ 
				const userid=this.userinfo.id;
				const result=await this.request({url: this.bsurl+'user/playlist?uid='+userid});
				let index =result.playlist.findIndex(v=>{
					return v.userId!=userid;
				})
				const collectList=result.playlist.splice(index).map(v=>{
					return {
						name:v.name,
						id:v.id,
						coverImgUrl:v.coverImgUrl+'?param=80y80',
						trackCount:v.trackCount,
						playCount:v.playCount
					}
				});
				this.collectList=collectList;
				
				const createList=result.playlist.map(v=>{
					return {
						name:v.name,
						id:v.id,
						coverImgUrl:v.coverImgUrl+'?param=80y80',
						trackCount:v.trackCount,
						playCount:v.playCount
					}
				});
				this.createList=createList;
				 //判断是否有完成加载 
				if(this.Finish()){
					setTimeout(()=>{
						this.isshow=false
					}, 1000);
				}	 			   
			},
 			async UserLike(){
			    let likeMusic=uni.getStorageSync("likeMusic")||[];
				let userid=this.userinfo.id;
				if(likeMusic.length==0){ 
 					const likeMusic=await this.request({url: this.bsurl+'likelist?uid='+userid}); 
					uni.setStorageSync("likeMusic", likeMusic);
				}
			}
		}
	}
</script>

<style lang="less" scoped> 

</style>
